<style lang="less">
    .s1{
        .ivu-select-dropdown-list {
            height:200px;
        }
    }
</style>
<template>
    <div class="search">
        <Row>
            <Col>
                <Card>
                        <Form ref="searchForm" :model="searchForm" inline :label-width="110" class="search-form"  :rules="formValidate">

                            <Row>
                                <Col span="8">
                                    <Form-item label="申请号" prop="applyNo"  >
                                        <Input type="text" v-model.trim="searchForm.applyNo" clearable placeholder="请输入"
                                               style="width: 200px;" />
                                    </Form-item>
                                </Col>

                                <Col span="8">
                                <Form-item label="客户姓名" prop="custName" >
                                    <Input type="text" v-model.trim="searchForm.custName" clearable placeholder="请输入"
                                           style="width: 200px;" />
                                </Form-item>
                                </Col>

                                <Col span="8">
                                <Form-item label="合同号" prop="contractNo" >
                                    <Input type="text" v-model.trim="searchForm.contractNo"  placeholder="请输入"
                                           style="width: 200px"/>
                                </Form-item>
                                </Col>
                            </Row>

                            <Row>
                                        <Col span="8">
                                            <Form-item label="费用描述" prop="feeType" >
                                                <Select v-model="searchForm.feeType" placeholder="请选择" clearable  style="width: 200px;height: 52px">
                                                    <Option :value="item.value" v-for="(item,index) in costTypeList" :key="index"> {{item.title}}</Option>
                                                </Select>
                                            </Form-item>
                                        </Col>

                                        <Col span="8">

                                            <Form-item label="处理状态" prop="status" >
                                                <Select v-model="searchForm.status" placeholder="请选择" clearable  style="width: 200px;height: 52px">
                                                    <Option :value="item.value" v-for="(item,index) in statusList" :key="index"> {{item.title}}</Option>
                                                </Select>
                                            </Form-item>
                                        </Col>

                                        <Col span="8">
                                            <Form-item label="申请时间" prop="applyDate" >
                                            <DatePicker v-model="searchForm.applyDate" type="daterange" format="yyyy-MM-dd"  placeholder="选择起止时间"
                                                        style="width: 200px">
                                            </DatePicker>
                                        </Form-item>
                                        </Col>
                                </Row>

                            <Row>
                                        <Col span="8">
                                            <Form-item label="结束时间" prop="endDate" >
                                            <DatePicker v-model="searchForm.endDate" type="daterange" format="yyyy-MM-dd"  placeholder="选择起止时间"
                                                        style="width: 200px">
                                            </DatePicker>
                                        </Form-item>
                                        </Col>

                                        <Col span="8">
                                            <Form-item label="生效日" prop="effectiveDate" >
                                            <DatePicker v-model="searchForm.effectiveDate" type="daterange" format="yyyy-MM-dd"  placeholder="选择起止时间"
                                                        style="width: 200px">
                                            </DatePicker>
                                        </Form-item>
                                        </Col>

                                        <Col span="8">
                                            <Form-item label="到期日" prop="dueDate" >
                                            <DatePicker v-model="searchForm.dueDate" type="daterange" format="yyyy-MM-dd"  placeholder="选择起止时间"
                                                        style="width: 200px">
                                            </DatePicker>
                                        </Form-item>
                                        </Col>
                                </Row>
                        </Form>

                        <Form :label-width="490" >
                            <Form-item style="margin-left:-35px;" class="br">
                                <Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button>
                                <Button @click="handleReset" type="primary" icon="ios-trash-outline">重置</Button>
                            </Form-item>
                        </Form>



                    <Row class="operation" style="text-align: left">
                        <Button @click="add" type="primary" icon="md-add">新增申请</Button>
                    </Row>

                    <Row>

                        <Table :loading="loading" border :columns="columns" :data="data" sortable="custom"
                               @on-sort-change="changeSort" @on-selection-change="showSelect" ref="selection">

                            <template slot-scope="{ row, index }" slot="action">
                                <!--
                                    处理  isViewBtn ~~审核中 待补件 待补件审核~~
                                    编辑 草稿
                                    删除 草稿
                                -->
                                <Button :disabled="!row.isViewBtn"  type="primary" size="small" @click="showContractDetial(row)">处理</Button>
<!--
                                <Button :disabled="row.processStatus !== 'draft'" type="primary" size="small" @click="showContractDetial(row)">编辑</Button>

                                <Button :disabled="row.processStatus !== 'draft'" type="error" size="small" @click="del(row)">删除</Button>-->
                            </template>

                            <template slot-scope="{ row, index }" slot="applyNo">
                                <a @click="checkDetail(row)">{{row.applyNo}}</a>
                            </template>

                            <template slot-scope="{ row, index }" slot="costType">
                                <span>{{setCostTypeTitle(row.costType)}}</span>
                            </template>

                            <template slot-scope="{ row, index }" slot="status">
                                <span>{{setStatusTitle(row.status)}}</span>
                            </template>

                            <template slot-scope="{ row, index }" slot="dueDate">
                                <span>{{timestampToTime(row.dueDate)}}</span>
                            </template>
                            <template slot-scope="{ row, index }" slot="effectiveDate">
                                <span>{{timestampToTime(row.effectiveDate)}}</span>
                            </template>
                            <template slot-scope="{ row, index }" slot="applyDate">
                                <span>{{timestampToTime(row.applyDate)}}</span>
                            </template>
                            <template slot-scope="{ row, index }" slot="endDate">
                                <span>{{timestampToTime(row.endDate)}}</span>
                            </template>

                            <template slot-scope="{ row, index }" slot="isEffect">
                                <span>{{row.isEffect == 'yes' ?  '生效' : '未生效'}}</span>
                            </template>

                        </Table>
                    </Row>
                    <Row type="flex" justify="end" class="page">
                        <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize"
                              @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]"
                              size="small" show-total show-elevator show-sizer></Page>
                    </Row>
                </Card>
            </Col>
        </Row>

        <ActivatedCase
            :getDataFn="getDataFn"
            :isSP="isSP"
            :modal="modal"
            modalTitle="已激活案件列表"
            :dataDict="dataDict"
            @showContractDetial="showContractDetial"
            @closeModal="closeModal"
            :contractBusiness="contractBusiness"
            :handleBusiness="'costExempt'"
        />
    </div>


</template>

<script>
    //这个暂时不知道是干啥的
    import {mapGetters} from "vuex";
    import ActivatedCase from "_p/basic/pages/contract/common/activated-case/index";
    import {formatDate} from "_c/iview/components/date-picker/util";
    import {getDictDataByType} from "_p/basic/api/admin/datadic";

    import {
        getCanCostExemptListByCondition,
        getCostExemptList,
    } from "@/projects/basic/api/contract/cost-exempt/costExempt";

    import circleLoading from "_c/circle-loading/circle-loading.vue";
    import {getDictDataList} from "_p/basic/assets/contract/js/utils";

    export default {
        name: "cost-exempt-list",
        components: {
            circleLoading,
            ActivatedCase
        },
        data() {
         /*   const validateName = (rule, value, callback) => {
                var reg = /^[\u4e00-\u9fa5_a-zA-Z]+$/;
                if (!reg.test(value) && value != "") {
                    callback(new Error("人名格式有误!"));
                } else {
                    callback();
                }
            };*/

            return {
                /**新增搜索窗口用**/

                //互斥业务
                contractBusiness:["costExemptBill","costExempt"],
                //是否是经销商
                isSP: false,
                dataDict: {}, // 数据字典
                modalTitle: "已激活案件列表",
                //新增窗口开关控制
                modal: false,
                //-----------------------
                //状态字典
                statusList:[],
                //费用描述字典
                costTypeList:[],

                loading: false,
                operationLoading: false,
                drop: false,
                dropDownContent: "更多",
                dropDownIcon: "ios-arrow-down",
                selectCount: 0,
                selectList: [],
                searchForm: {
                    //申请号
                    applyNo:"",
                    //客户姓名
                    custName:"",
                    //合同号
                    contractNo:"",
                    //费用类型
                    feeType:"",
                    //状态
                    status:"",
                    //申请时间
                    applyDate:[],
                    //结束时间
                    endDate:[],
                    //结束时间
                    dueDate:[],
                    //生效日
                    effectiveDate:[],

                    pageNumber: 1,
                    pageSize: 10,
                },

                selectDate: null,
                userModalVisible: false,
                modalTitle: "",
                columns: [
                    /*{
                        type: 'index',
                        title:"序号",
                        minWidth: 80,
                        align: "center",
                        fixed: "left"

                    },*/
                    {
                        title: "操作",
                        key: "action",
                        minWidth: 100,
                        align: "center",
                        fixed: "left",
                        slot: "action"
                    },
                    {
                        title: "申请编号",
                        minWidth: 180,
                        key: "applyNo",
                        slot: "applyNo",
                        align: "center",
                    },
                    {
                        title: "费用类型",
                        key: "costType",
                        slot: "costType",
                        align: "center",
                        minWidth: 150,
                    },

                    {
                        title: "内部合同号",
                        key: "contractNo",
                        minWidth: 180,
                        align: "center",
                        //sortable: true
                    },
                    {
                        title: "客户姓名",
                        key: "custName",
                        minWidth: 120,
                        align: "center",
                    },
                    {
                        title: "到期日",
                        key: "dueDate",
                        slot: "dueDate",
                        minWidth: 115,
                        align: "center",
                    },
                    {
                        title: "费用总计",
                        key: "totalCost",
                        minWidth: 130,
                        align: "center",
                    },

                    {
                        title: "费用金额",
                        key: "costAmt",
                        minWidth: 110,
                        align: "center",

                    },
                    {
                        title: "减免比例%",
                        key: "reductionRatio",
                        minWidth: 110,
                        align: "center",

                    },
                    {
                        title: "豁免金额",
                        key: "exemptionAmt",
                        minWidth: 110,
                        align: "center",

                    },
                    {
                        title: "到期金额",
                        key: "dueAmt",
                        minWidth: 110,
                        align: "center",

                    },
                    {
                        title: "处理状态",
                        key: "status",
                        slot: "status",
                        minWidth: 110,
                        align: "center",

                    },
                    {
                        title: "申请日期",
                        key: "applyDate",
                        slot: "applyDate",
                        minWidth: 110,
                        align: "center",

                    },
                    {
                        title: "结束日期",
                        key: "endDate",
                        slot: "endDate",
                        minWidth: 110,
                        align: "center",

                    },
                    {
                        title: "生效",
                        key: "isEffect",
                        slot: "isEffect",
                        minWidth: 110,
                        align: "center",

                    },
                    {
                        title: "生效日",
                        key: "effectiveDate",
                        slot: "effectiveDate",
                        minWidth: 110,
                        align: "center",

                    },
                   /* {
                        title: "详情",
                        key: "effectiveDate",
                        minWidth: 110,
                        align: "center",
                    },*/

                ],
                pageNo: 1,
                data: [],
                total: 0,
                formValidate: {
                    /*corporateName: [
                        {validator: validateName, trigger: "change"}
                    ],
                    salesMan: [
                        {validator: validateName, trigger: "change"}
                    ],*/
                },


                //新增的弹窗用
                dicttArr: [
                    "dataSource",
                    "processStatus",
                    "businessSource",
                    "PersonRoleType",
                    "contractStatus",
                    "channelType"
                ],
                dataDict: {}, // 数据字典

            };
        },
        methods: {
            init() {
                this.initDataDic();
                this.getCostExemptList();
                this.getDictDataList();
            },

            //新增弹窗用的字典
            getDictDataList() {
                getDictDataList(this.dicttArr).then(res => {
                    console.group("数据字典:");
                    console.log(this.dicttArr.join("  "));
                    console.log(JSON.parse(JSON.stringify(res)));
                    console.groupEnd();
                    this.dataDict = res;
                });
            },


            changePage(v) {
                this.searchForm.pageNumber = v;
                this.getCostExemptList();
                this.clearSelectAll();
            },
            changePageSize(v) {
                this.searchForm.pageSize = v;
                this.getCostExemptList();
            },
            clearSelectAll() {
                this.$refs.table.selectAll(false);
            },
            selectDateRange(v) {
                if (v) {
                    this.searchForm.startDate = v[0];
                    this.searchForm.endDate = v[1];
                }
            },

            handleSearch() {
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.getCostExemptList();
            },

            handleReset() {
                this.$refs.searchForm.resetFields();
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.selectDate = null;
                // 重新加载数据
                this.getCostExemptList();
            },
            changeSort(e) {
                this.searchForm.sort = e.key;
                this.searchForm.order = e.order;
                if (e.order === "normal") {
                    this.searchForm.order = "";
                }

            },

            dropDown() {
                if (this.drop) {
                    this.dropDownContent = "更多";
                    this.dropDownIcon = "ios-arrow-down";
                } else {
                    this.dropDownContent = "收起";
                    this.dropDownIcon = "ios-arrow-up";
                }
                this.drop = !this.drop;
            },
            showSelect(e) {
                this.selectList = e;
                this.selectCount = e.length;
            },
            //多条件查询豁免费用
            getCostExemptList() {
                // 多条件搜索车商列表
                //二手车有效期
                if(this.searchForm.applyDate != null || this.basicTypeForm.applyDate !=""){
                    this.searchForm.applyDate[0] =formatDate(this.searchForm.applyDate[0],"yyyy-MM-dd")
                    this.searchForm.applyDate[1] =formatDate(this.searchForm.applyDate[1],"yyyy-MM-dd")
                }
                if(this.searchForm.endDate != null || this.basicTypeForm.endDate !=""){
                    this.searchForm.endDate[0] =formatDate(this.searchForm.endDate[0],"yyyy-MM-dd")
                    this.searchForm.endDate[1] =formatDate(this.searchForm.endDate[1],"yyyy-MM-dd")
                }
                if(this.searchForm.effectiveDate != null || this.basicTypeForm.effectiveDate !=""){
                    this.searchForm.effectiveDate[0] =formatDate(this.searchForm.effectiveDate[0],"yyyy-MM-dd")
                    this.searchForm.effectiveDate[1] =formatDate(this.searchForm.effectiveDate[1],"yyyy-MM-dd")
                }
                if(this.searchForm.dueDate != null || this.basicTypeForm.dueDate !=""){
                    this.searchForm.dueDate[0] =formatDate(this.searchForm.dueDate[0],"yyyy-MM-dd")
                    this.searchForm.dueDate[1] =formatDate(this.searchForm.dueDate[1],"yyyy-MM-dd")
                }
                let param ={
                    applyNo: this.searchForm.applyNo.replace(/\s*!/g,""),
                    custName: this.searchForm.custName.replace(/\s*!/g,""),
                    contractNo: this.searchForm.contractNo.replace(/\s*!/g,""),
                    feeType: this.searchForm.feeType,
                    status:this.searchForm.status,

                    applyDateStart:this.searchForm.applyDate[0],
                    applyDateEnd:this.searchForm.applyDate[1],

                    endDateStart:this.searchForm.endDate[0],
                    endDateEnd:this.searchForm.endDate[1],

                    effectiveDateStart:this.searchForm.effectiveDate[0],
                    effectiveDateEnd:this.searchForm.effectiveDate[1],

                    dueDateStart:this.searchForm.dueDate[0],
                    dueDateEnd:this.searchForm.dueDate[1],

                    pageNumber: this.searchForm.pageNumber,
                    pageSize: this.searchForm.pageSize,

                }
                this.loading = true;
                getCostExemptList(param).then(res => {
                    this.loading = false;
                    if (res.code === "0000") {
                        this.data = res.data.records;
                        this.total = res.data.total;
                    }
                });
            },

            add(){
                this.modal =true;
            },
            //获取字典
            initDataDic() {
                this.statusDic();
                this.costTypeDic();

            },
            //状态数据字典
            statusDic() {
                let param = {
                    type: "processStatus"
                }
                getDictDataByType(param.type).then(res => {
                    if (res.code === "0000") {
                        this.statusList = res.data;
                    }
                });
            },
            //费用描述字典
            costTypeDic() {
                //基础库里费用类型为 feeType
                getDictDataByType("feeType").then(res => {
                    if (res.code === "0000") {
                        this.costTypeList = res.data;
                    }
                });
            },

            //字典翻译
            //状态
            setStatusTitle(val){
                if(val==null ||val=="" ||val ==undefined){
                    return;
                }
                let dic = {};
                this.statusList.forEach(column => {
                    if(column.value === val){
                        dic = column;
                    }
                });
                return dic.title;
            },
            //类型
            setCostTypeTitle(val){
                if(val==null ||val=="" ||val ==undefined){
                    return;
                }
                let dic = {};
                this.costTypeList.forEach(column => {
                    if(column.value === val){
                        dic = column;
                    }
                });
                return dic.title;
            },

            //详情页
            showContractDetial(params, type) { //type: read 查看
                if (!params && !params.contractNo) return;
                if (type) params.readOnly = true;
                this.modal = false;
                this.afs.newTab(
                    this,
                    "projects/basic/pages/contract/cost-exempt/cost-exempt-details/index",
                    "费用豁免详情",
                    "ios-add",
                    params,
                    "cost-exempt-details" + this.pageNo,
                    [],
                    true
                );
                this.pageNo += 1;
            },
            closeModal() {
                this.modal = false;
            },
            checkDetail(row){
                this.showContractDetial(row, 'readOnly');
            },

            //时间戳转成时间
            timestampToTime (cjsj) {
                if(cjsj){
                    var date = new Date(parseInt(cjsj)) //时间戳为10位需*1000，时间戳为13位的话不需乘1000
                    var Y = date.getFullYear() + '-'
                    var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-'
                    var D = parseInt(date.getDate()) >= 10?  date.getDate()+ ' ' : "0"+date.getDate()+ ' '
                    return Y+M+D
                }else{
                    return "";
                }
            },


        },
        computed: {
            ...mapGetters({
                userInfo: "userInfo",
                roleType: "roles"
            }),
            getDataFn: () => getCanCostExemptListByCondition,
        },
        mounted() {
            this.init();
        },
        watch: {
            '$route'(to,from){
                    this.handleReset();
            }
        },
    };
</script>
